/*
 * Copyright (c) 2021 Huawei Device Co., Ltd.
 * Licensed under the Apache License,Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.container {
    width: 480px;
    height: 480px;
    justify-content: center;
    align-items: center;
}

.body {
    width: 480px;
    height: 480px;
    justify-content: center;
    align-items: center;
    background-color: #E1E2E3;
    flex-direction: column;
}
    .full {
        width: 480px;
        height: 292px;
    }

    .stack-full {
        width: 480px;
        height: 480px;
    }

    .top-part {
        width: 440px;
        height: 148px;
        margin-top: 0px;
        margin-left: 0px;
        flex-direction: row;
    }

    .date-and-setting-part {
        width: 200px;
        height: 148px;
        margin-left: 0px;
        margin-top: 0px;
        flex-direction: column;
        background-color: #FFFFFF;
        border-radius: 14px;
    }
        .date-and-weekend {
            width: 180px;
            height: 22px;
            margin-top: 17px;
            margin-left: 20px;
            flex-direction: row;
        }
            .date-part {
                width: 120px;
                height: 22px;
                font-size: 15px;
                margin-top: 0px;
                color: #000000;
            }
            .weekend-part {
                width: 52px;
                height: 22px;
                font-size: 15px;
                margin-top: 0px;
                margin-left: 0px;
                color: #000000;
            }
        .time-part {
            width: 150px;
            height: 42px;
            font-size: 30px;
            margin-top: 0px;
            margin-left: 20px;
            color: #000000;
        }
        .setting-part {
            width: 87px;
            height: 28px;
            margin-top: 19px;
            margin-left: 20px;
            flex-direction: row;
        }
            .setting-icon {
                width: 39px;
                height: 28px;
                margin-top: 0px;
                margin-left: 0px;
            }

    .actual-status-part {
        width: 225px;
        height: 148px;
        margin-top: 0px;
        margin-left: 15px;
        flex-direction: column;
        background-color: #FFFFFF;
        border-radius: 14px;
    }
        .actual-statue-icon-txt {
            width: 205px;
            height: 37px;
            margin-top: 15px;
            margin-left: 20px;
            flex-direction: row;
        }
            .actual-status-icon {
                width: 28px;
                height: 28px;
                margin-top: 7px;
                margin-left: 0px;
            }
            .actual-status-txt {
                width: 104px;
                height: 37px;
                margin-left: 10px;
                margin-top: 1px;
                font-size: 24px;
                color: #000000;
            }
        .actual-status-content {
            width: 225px;
            height: 42px;
            margin-top: 17px;
        }
        .actual-status-content-txt {
            width: 225px;
            height: 42px;
            font-size: 30px;
            color: #00D400;
            text-align: center;
        }

    .bottom-part {
        width: 440px;
        height: 292px;
        margin-top: 0px;
        margin-left: 0px;
    }
        .button-inner-all {
            width: 440px;
            height: 272px;
            margin-top: 20px;
            background-color: #FFFFFF;
            border-radius: 19px;
            flex-direction: column;
        }
        .blank-inner {
            width: 440px;
            height: 20px;
            background-color: #E1E2E3;
        }
        .his-log-icon-txt {
            width: 420px;
            height: 28px;
            margin-left: 20px;
            margin-top: 20px;
            flex-direction: row;
        }
            .his-log-icon {
                width: 28px;
                height: 28px;
                margin-top: 0px;
                margin-left: 0px;
            }
            .history-log-title {
                width: 104px;
                height: 33px;
                font-size:24px;
                margin-left: 10px;
                margin-top: -6px;
                color: #000000;
            }

        .bottom-list {
            width: 386px;
            height: 170px;
            margin-top: 21px;
            margin-left: 54px;
            background-color: #FFFFFF;
            flex-direction: column;
            align-items: flex-start;
        }
        .bottom-his-list-item {
            width:386px;
            height:30px;
            margin-top: 0px;
            margin-left: 0px;
            padding-right: 0px;
        }
            .his-item-text-time {
                height: 30px;
                text-align: left;
                margin-top: 0px;
                margin-left: 0px;
                color: #000000;
            }
            .his-item-text-hint {
                height: 30px;
                width: 120px;
                color: black;
                font-size:18px;
                margin-top: 0px;
                margin-left: 175px;
                text-align: right;
                padding-right: 0px;
            }

.title {
    width: 300px;
    font-size:30px;
    text-align: left;
    color: black;
}

.body-title{
    width: 100%;
    height: 25%;
    font-size:30px;
    text-align: left;
    margin-left: 10%;
    margin-top: 5%;
    color: white;
}

.body-title-content{
    font-size:40px;
    text-align: left;
    margin-left: 10%;
    margin-top: 3%;
    color: white;
}

.body-top-right-content{
    width: 100%;
    height: 50%;
    margin-top: 0%;
    text-align: center;
    justify-content: center;
}

.body-left-down-content-txt{
    font-size:30px;
    text-align: center;
    justify-content: center;
    color: black;
}

.title-in-content {
    font-size:30px;
    text-align: center;
    color: black;
}

.timer-txt {
    font-size:30px;
    text-align: center;
    color: black;
}

.setting-btn {
    width: 50%;
    height: 100%;
    align-items: center;
    text-align: center;
    justify-content: center;
    color:white;
    font-size:28px;
}

.timer-txt-small {
    font-size:25px;
    text-align: center;
    color: black;
}

.his-item-text-week {
    height: 100%;
    text-align: left;
    color: black;
    font-size:20px;
}

.image-frame {
    width: 200px;
    height: 200px;
    margin-top: 0px;
    margin-left: 105px;
    background-color: transparent;
}

.his-item-space {
    height: 100%;
    width: 10px;
    text-align: left;
    font-size: 20px;
}
